<template>
	<view class="applyTip-content">
		<view class="user-list ">
			<view class="user-message u-flex-between">
				<view class="left u-flex-between">
					<!-- <view class="select-user">
						请选择角色
					</view> -->
					<view class="user-img">
						<u-avatar :src="headimg" size="112" shape="circle"></u-avatar>
					</view>
					<view class="">
						<view class="user-name">
							{{name}}
						</view>
						<view class="user-phone text-gray">
							{{phone}}
						</view>
					</view>
				</view>
				<view class="out" @click="out">
					<u-icon name="man-delete" color="#333" size="56"></u-icon>
					<view class="">
						退出
					</view>
				</view>
			</view>
			<view class="user-item u-flex" @click="selectUser(item)" v-for="item in list">
				<view class="left">
					<!-- <u-avatar
					            :text="item.abbrevia[0]"
					            fontSize="60"
					            randomBgColor
								size="112"
					    ></u-avatar> -->
					<u-avatar :src="headimg" size="112" shape="square"></u-avatar>
					<!-- <u-icon name="account-fill" size="108" color="#fd7400"></u-icon> -->
				</view>
				<view class="right">
					<view class="user-name">
						{{item.role}}
					</view>
					<view class="status-box">
						<view class="wd">
							{{item.name}}
						</view>
						<!-- <view class="status">{{item.status}}</view> -->
					</view>
				</view>
				<view class="u-flex-center arrow-right">
					<u-icon name="arrow-right" color="rgb(196, 196, 196)" size="28"></u-icon>
				</view>
			</view>
			<!-- <view class="user-item">
				<view class="user-name">
					销售人员
				</view>
				<view class="status-box">
					<view class="wd">
						江西网点
					</view>
					<view class="status">正常</view>
				</view>
			</view>	 -->
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [],
				id: '',
				src: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
				active: false,
				headimg:'',
				name:'',
				phone:''
			};
		},
		onLoad(e) {
			// console.log(JSON.parse(decodeURIComponent(e)))
			// let a = JSON.parse(decodeURIComponent(e.data))
			let a = JSON.parse(e.data)
			this.name=a.name
			this.phone=a.phone
			this.list = a.roles
			this.headimg=a.headimg
			this.id = a.id
			uni.setStorageSync('acId', this.id)
			
			this.isBindingWeChat();
		},
		// 下拉刷新
		onPullDownRefresh() {
			this.getPullRefresh()
		},
		methods: {
			// 判断是否绑定过微信小程序
			async isBindingWeChat() {
				const res = await uni.$api.login.isBindingWeChat(this.id);
				console.log(res)
				if(res.code == 0) {
					if(!res.data) {
						uni.showModal({
							title: '支持微信一键登录，是否绑定',
							success: (res) => {
								if (res.confirm) {
									this.bindingWeChat();
								}
							}
						});
					}
				}
			},
			// 绑定过微信小程序
			async bindingWeChat() {
				const codeRes = await this.getLoginCode();
				// let isLoginRes = await uni.$api.login.userWeChatLogin(codeRes.code);
				// console.log('登录状态-----',isLoginRes.code);
				const res = await uni.$api.login.bindingWeChat(codeRes.code,this.id)
				if(res.code == 0) {
					uni.showToast({
						title: '微信绑定成功！',
						icon: 'success'
					});
				}
			},
			// 获取登录code
			getLoginCode() {
				return new Promise((resolve, reject) => {
					wx.login({
					  provider: 'weixin', //使用微信登录
					  success: function (res) {
						resolve(res)
					  },
					  fail: function(err) {
						reject(err);
					  }
					});
				})
			},
			
			// 下拉刷新请求数据
			getPullRefresh(){
				console.clear()
				console.log('onPullDownRefresh')
				
				
				uni.stopPullDownRefresh()
			},
			async selectUser(item) {
				console.log(item, '点击了')
				let custAccid = item.custAccId
				let empId = item.empId
				uni.setStorageSync('custAccid', custAccid)
				uni.setStorageSync('empId', empId)
				uni.setStorageSync('roleId', item.id)
				
				const res = await uni.$api.login.getUser({
					custAccid: custAccid,
					empId: item.empId,
					roleId: item.id,
					username: this.name,
					password: this.phone,
					acId: this.id
				})
				console.log(res)
				if (res.code === 0) {
					uni.showLoading({
						title: '加载中'
					});
					setTimeout(function() {
						uni.hideLoading();
						uni.reLaunch({
							url: '/pages/index/index',
							fail(error) {
								console.log(error)
							}
						})
					}, 2000);

				} else {
					return uni.showToast({
						title: res.msg,
						icon: 'none', 
					});
				}
			},
			out() {
				uni.showModal({
					content: '是否退出登录',
					confirmColor: "#fd7400",
					confirmText: '确认',
					success: res => {
						if (!res.confirm) return
						uni.reLaunch({
							url: '/pages/login/login'
						}) 
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.active {
		background-color: #fff;
	}

	.applyTip-content {
		// margin-bottom: 28px;
		height: 100vh;
		box-sizing: border-box;
		width: 100%;
		background: linear-gradient(to bottom, rgba(255, 176, 107, 0.2) 0%, rgba(255, 255, 255, 0) 35%, rgba(255, 255, 255, 0) 101%);

		.user-list {
			overflow: auto;
			margin: 0 56rpx;

			.user-message {
				padding: 60rpx 0;
				display: flex;

				.user-img {
					margin-right: 30rpx;
				}

				.user-name {
					font-size: 40rpx;
					font-weight: 700;
				}

				.user-phone {
					font-size: 26rpx;
					margin-top: 12rpx;
				}

				.right {
					width: 100%;

					.back {
						margin-bottom: 20rpx;
					}
				}
			}

			.user-item {
				background: rgb(255, 243, 232);
				padding: 0 32rpx;
				border-radius: 6rpx;
				margin-bottom: 42rpx;
				min-height: 172rpx;
				border-radius: 20rpx;
				position: relative;

				.left {
					display: flex;
					justify-content: center;
					margin-right: 32rpx;
					align-items: center;
				}

				.right {
					display: flex;
					flex-direction: column;
					justify-content: center;
					width: 100%;
				}

				.arrow-right {
					position: absolute;
					right: 0;
					top: 24px;
					right: 18px;
				}

				.user-name {
					color: #000;
					margin-bottom: 20rpx;
				}

				.status-box {
					display: flex;

					.wd {
						color: #a6a6a6;
						margin-right: 12rpx;
						font-size: 24rpx;
					}

					.status {
						color: #2aa438;
					}
				}
			}
		}
	}
</style>